<template>
	<view class="box proDet">
		<view class="header" v-if="columnData.yearRate != 0.00">
			<view class="headerTit"><text class="headerText">{{columnData.modeName}}</text><text class="headerTextcen">{{columnData.productBrief}}</text></view>
			<view class="con"><text class="content">月费率</text><text class="contentText">{{columnData.yearRate}}%</text></view>
			<view class="con"><text class="content">{{columnData.brokerChargeExplain}}</text></view>
			<view class="con"><text class="content contentyj">佣金</text><text class="content contentBorder">{{columnData.brokerExtract}}</text></view>
		</view>
		<block v-if="moveSpecialCode!== null">
			<rich-text :nodes="moveSpecialCode"></rich-text>
		</block>
	</view>
</template>

<script>
	import { formatDecimal } from "@/common/util.js";
	export default {
		data() {
			return {
				columnData:{yearRate:10,modeName:"公积金",productBrief:0,brokerChargeExplain:"系统错误，请重新登录"},
				moveSpecialCode:null,
				colunmId: null
			}
		},
		onLoad(option) {
			this.columnId = option.id;
		},
		mounted(){
			this.getProductOne(this.columnId);
		},
		methods: {
			//获取产品的详细介绍
			getProductOne(id) {
				this.$api.getProductOne(id).then(res =>{
					res.data.data.yearRate =formatDecimal(res.data.data.yearRate, 2)
					res.data.data.brokerExtract = res.data.data.brokerExtract.substring(3)
					this.columnData= res.data.data,
					this.moveSpecialCode= res.data.data.moveSpecialCode 
				})
			}
		}
	}
</script>

<style scoped>
	.box{
		padding-top: 20rpx;
	}
</style>
